<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
		<meta name="theme-color" content="#171a21">
		<link rel="shortcut icon" href="img/index/favicon.ico" type="image/x-icon">
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="css/carousel.css" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/personal.css" />
		<title>Steam 社区 :: SuperMax</title>
	</head>

	<body>
		<!--头部S-->
		<header>
			<div class="content clearfix">
				<div class="logo">
					<span><a href="index.html"><img src="img/index/globalheader_logo.png" width="176" height="44"/></a></span>
				</div>
				<!--头部列表S-->
				<div class="supernav_container">
					<div class="container-fluid">
						<div id="navbar" class="navbar-collapse collapse">
							<ul class="nav navbar-nav">
								<li class="dropdown">
									<a href="#" class="dropdown-toggle menuitem" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">商店</a>
									<ul class="dropdown-menu sub_dropdown">
										<li>
											<a href="#">精选</a>
										</li>
										<li>
											<a href="#">探索</a>
										</li>
										<li>
											<a href="#">鉴赏家</a>
										</li>

										<li>
											<a href="#">愿望单</a>
										</li>
										<li>
											<a href="#">新闻</a>
										</li>
										<li>
											<a href="#">统计</a>
										</li>
									</ul>
								</li>
								<li class="dropdown">
									<a href="#" class="dropdown-toggle menuitem" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">社区</a>
									<ul class="dropdown-menu sub_dropdown">
										<li>
											<a href="#">主页</a>
										</li>
										<li>
											<a href="#">讨论</a>
										</li>
										<li>
											<a href="#">创意工坊</a>
										</li>

										<li>
											<a href="#">市场</a>
										</li>
										<li>
											<a href="#">实况直播</a>
										</li>

									</ul>
								</li>
								<li class="dropdown">
									<a href="#" class="dropdown-toggle menuitem" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">SUPERMAX</a>
									<ul class="dropdown-menu sub_dropdown">
										<li>
											<a href="#">动态</a>
										</li>
										<li>
											<a href="#">个人资料</a>
										</li>
										<li>
											<a href="#">好友</a>
										</li>

										<li>
											<a href="#">组</a>
										</li>
										<li>
											<a href="#">内容</a>
										</li>
										<li>
											<a href="#">徽章</a>
										</li>
										<li>
											<a href="#">库存</a>
										</li>
									</ul>
								</li>

								<li class="dropdown">
									<a href="#" class="dropdown-toggle menuitem" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">关于</a>
								</li>

								<li class="dropdown">
									<a href="#" class="dropdown-toggle menuitem" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">客服</a>
								</li>

							</ul>

						</div>
						<!--/.nav-collapse -->
					</div>
					<!--/.container-fluid -->

				</div>

				<!--头部列表E-->
				<!--头部右-->
				<div class="header_right">
					<div class="right_menu">
						<div class="install_btn">
							<div class="btn_leftcap"></div>
							<div class="btn_rightcap"></div>
							<a class="btn_content">安装 Steam</a>
						</div>
						<!-- Single button -->
						<div class="btn-group">
							<button type="button" class="btn btn-default dropdown-toggle noti_btn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <img src="img/index/header_menu_notifications.png" width="11" height="8"/></button>
							<ul class="dropdown-menu noti_dropdown">
								<li>
									<a href="#"><span>0</span><span>条新留言</span></a>
								</li>
								<li>
									<a href="#"><span>0</span><span>件新物品在您的库存中</span></a>
								</li>
								<li>
									<a href="#"><span>0</span><span>份新邀请</span></a>
								</li>

								<li>
									<a href="#"><span>0</span><span>份新礼物</span></a>
								</li>
								<li>
									<a href="#"><span>0</span><span>条未读聊天信息</span></a>
								</li>
							</ul>
						</div>
						<div class="btn-group">
							<button type="button" class="btn btn-default dropdown-toggle noti_btn username_btn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    hongyvan <span class="caret"></span></button>
							<ul class="dropdown-menu noti_dropdown">
								<li>
									<a href="#"><span>注销</span></a>
								</li>
								<li>
									<a href="#"><span>账户明细</span></a>
								</li>
								<li>
									<a href="#"><span>偏好</span></a>
								</li>

								<li>
									<a href="#"><span>更改语言</span></a>
								</li>
								<li>
									<a href="#"><span>查看个人资料</span></a>
								</li>
							</ul>
						</div>
						<div class="wallet_ctn">
							<a href="">¥ 9999.99</a>
						</div>
					</div>
					<a href="http://steamcommunity.com/id/hongyvan/" class="user_avatar "><img src="img/index/mine.jpg"></a>
				</div>
		</header>
		<!--头部E-->
		<section>
			<!--personal-headerS-->
			<div class="personalHeader">
				<div class="personImg pull-left">
					<img src="img/person/746410fc0c46568dc2c5bf92509ebee14dbf9b2a_full.jpg" />
				</div>
				<div class="personLevel pull-right">
					<p class="level_content"><span class="level_num">99</span>级</p>
					<div class="header_badge clearfix">
						<div class="badge_icon pull-left">
							<img src="img/person/ea1c6554159aaabe4cb8754cab3c8b670fcd25cb.png" />
						</div>
						<div class="icon_content">
							<p>A guy who knows a guy who knows Geralt</p>
							<span>100 点经验值</span>
						</div>
					</div>
					<a href=""><span class="badge_edit">
						编辑个人资料
					</span></a>
				</div>
				<div class="header_content">
					<h3>SuperMax</h3>
					<p><span>Yufan Hong </span><img src="img/person/cn.gif" /> Shenzhen, Guangdong, China</p>
				</div>
			</div>
			<!--personal-headerE-->
			<div class="main clearfix">
				<div class="trends pull-left">
					<div class="show_pic">
						<h3>截图展柜</h3>
						<div class="screen_shot clearfix">
							<div class="shotcase pull-left">
								<img src="img/person/witcher.jpg" />
							</div>
							<div class="pic_list pull-right">
								<div class="imglist1"><img src="img/person/darksouls.jpg" /></div>
								<div class="imglist2"><img src="img/person/witcher1.jpg" /></div>
								<div class="imgmore">
									+ 999
								</div>
							</div>
						</div>
					</div>
					<p class="show_news">最新动态</p>
					<div class="game_content clearfix">
						<div class="content_img pull-left">
							<a href=""><img src="img/person/wicther3.jpg" /></a>
						</div>
						<div class="content_time pull-right">
							<p>总时数 129 小时</p>
							<p>最后运行日期: 9月17日</p>
						</div>
						<div class="content_info">
							<p>Witcher 3 : Wild Hunt</p>
						</div>
					</div>
					<div class="game_content clearfix">
						<div class="content_img pull-left">
							<a href=""><img src="img/person/lifeisstrange.jpg" /></a>
						</div>
						<div class="content_time pull-right">
							<p>总时数 129 小时</p>
							<p>最后运行日期: 9月17日</p>
						</div>
						<div class="content_info">
							<p>Life Is Strange</p>
						</div>
						<div class="game_stats">
							<p><span>成就进度</span> 42 / 100 </p>
						</div>
					</div>
					<div class="game_content clearfix">
						<div class="content_img pull-left">
							<a href=""><img src="img/person/d293c8e38f56de2c7097b2c7a975caca49029a8b.jpg" /></a>
						</div>
						<div class="content_time pull-right">
							<p>总时数 129 小时</p>
							<p>最后运行日期: 9月17日</p>
						</div>
						<div class="content_info">
							<p>DARK SOULS™: Prepare To Die Edition</p>
						</div>
						<div class="game_stats">
							<p><span>成就进度</span> 42 / 100 </p>
						</div>
					</div>

					<!--查看愿望单-->
					<div class="check_recent">
						查看
						<span><a href="">所有最近玩过的</a></span>
						<span><a href="">愿望单</a></span>
						<span><a href="">评测</a></span>

					</div>

					<!--留言框-->
					<div class="leave_sugs">
						<span class="words">留言</span>
						<input type="checkbox" checked/>
						<span>
						订阅留言帖
					</span>
					</div>
					<div class="comments clearfix">
						<div class="comments_img pull-left">
							<img src="img/person/746410fc0c46568dc2c5bf92509ebee14dbf9b2a.jpg" />
						</div>
						<div class="comments_box">
							<input type="text" placeholder="添加一条留言" />
						</div>
					</div>
				</div>
				<div class="info pull-right">
					<!--在线时间-->
					<p class="now_info">当前离线</p>
					<p>上次在线 <span>28</span> 小时 <span>8</span> 分钟前</p>
					<!--徽章游戏等-->
					<div class="ach_count">
						<div>
							<a href="">徽章<span>12</span></a>
						</div>
						<div><img src="img/person/100_54.png" alt="" /><img src="img/person/level01_54.png" /><img src="img/person/steamyears202_54.png" /><img src="img/person/aa6997bcd278d3c45836b188b6fab17074314b2a.png" /></div>
						<div>
							<a href="">游戏<span>122</span></a>
						</div>
						<div>
							<a href="">库存</a>
						</div>
						<div>
							<a href="">截图<span>999</span></a>
						</div>
						<div>
							<a href="">视频</a>
						</div>
						<div>
							<a href="">创意工坊物品</a>
						</div>
						<div>
							<a href="">评测<span>5</span></a>
						</div>
						<div>
							<a href="">指南</a>
						</div>
						<div>
							<a href="">艺术作品</a>
						</div>
					</div>

					<!--好友-->
					<div class="friends">
						<div class="friends_num">
							<a href="">好友</a><span>12</span>
						</div>
						<div class="friends_detail clearfix">
							<div class="friends_img pull-left">
								<img src="img/person/548f0ef72b0163265ad3cd96e5b36402c204c653_medium.jpg" />
							</div>
							<div class="firends_levels pull-right">80</div>
							<div class="friends_name">
								<p>阿尔特留斯</p>
								<p>在线</p>
							</div>
						</div>
						<div class="friends_detail friends_leaving  clearfix">
							<div class="friends_img pull-left">
								<img src="img/person/9adc0bf993403c7f306385e475b06a9565f01920_medium.jpg" />
							</div>
							<div class="firends_levels pull-right">40</div>
							<div class="friends_name">
								<p>杰洛特</p>
								<p>上次在线 <span>25</span> 小时<span>2</span> 分钟前</p>
							</div>
						</div>
						<div class="friends_detail clearfix">
							<div class="friends_img pull-left">
								<img src="img/person/2e8e374925bb1d745a37af00c9b3408fca5f42d0.jpg" />
							</div>
							<div class="firends_levels pull-right">20</div>
							<div class="friends_name">
								<p>Snake</p>
								<p>在线</p>
							</div>
						</div>
						<div class="friends_detail friends_leaving clearfix">
							<div class="friends_img pull-left">
								<img src="img/person/548f0ef72b0163265ad3cd96e5b36402c204c653_medium.jpg" />
							</div>
							<div class="firends_levels pull-right">19</div>
							<div class="friends_name">
								<p>甘尼克斯</p>
								<p>上次在线 <span>6</span> 天前</p>
							</div>
						</div>
						<div class="friends_detail clearfix">
							<div class="friends_img pull-left">
								<img src="img/person/548f0ef72b0163265ad3cd96e5b36402c204c653_medium.jpg" />
							</div>
							<div class="firends_levels pull-right">16</div>
							<div class="friends_name">
								<p>Cirilla</p>
								<p>在线</p>
							</div>
						</div>
						<div class="friends_detail friends_leaving clearfix">
							<div class="friends_img pull-left">
								<img src="img/person/548f0ef72b0163265ad3cd96e5b36402c204c653_medium.jpg" />
							</div>
							<div class="firends_levels pull-right">15</div>
							<div class="friends_name">
								<p>斯巴达克斯</p>
								<p>上次在线 <span>20</span> 天前</p>
							</div>
						</div>

					</div>
				</div>
			</div>
		</section>
	</body>

</html>